{% extends "admin/base_site.html" %}
{% load i18n admin_urls static admin_list unfold_list %}

{% block extrastyle %}
    {{ block.super }}

    <script src="{% url 'admin:jsi18n' %}"></script>

    {{ media.css }}

    {% if not actions_on_top and not actions_on_bottom %}
        <style>
            #changelist table thead th:first-child {width: inherit}
        </style>
    {% endif %}
{% endblock %}

{% block extrahead %}
    {{ block.super }}
    {{ media.js }}
{% endblock %}

{% block bodyclass %}{{ block.super }} app-{{ opts.app_label }} model-{{ opts.model_name }} change-list{% endblock %}

{% if not is_popup %}
    {% block breadcrumbs %}
        <div class="px-4 lg:px-12">
            <div class="{% if not cl.model_admin.list_fullwidth %}container{% endif %} mb-6 mx-auto -my-3 lg:mb-12">
                <ul class="flex">
                    {% url 'admin:index' as link %}
                    {% trans 'Home' as name %}
                    {% include 'unfold/helpers/breadcrumb_item.html' with link=link name=name %}

                    {% url 'admin:app_list' app_label=cl.opts.app_label as link %}
                    {% include 'unfold/helpers/breadcrumb_item.html' with link=link name=cl.opts.app_config.verbose_name %}

                    {% include 'unfold/helpers/breadcrumb_item.html' with link='' name=cl.opts.verbose_name_plural|capfirst %}
                </ul>
            </div>
        </div>
    {% endblock %}
{% endif %}

{% block coltype %}{% endblock %}

{% block nav-global-side %}
    {% block object-tools %}
        <div class="object-tools">
            {% block object-tools-items %}
                {% change_list_object_tools %}
            {% endblock %}
        </div>
    {% endblock %}
{% endblock %}

{% block content %}
    <div id="content-main">
        {% if cl.formset and cl.formset.errors %}
            {% include "unfold/helpers/messages/errornote.html" with errors=cl.formset.errors %}

            {{ cl.formset.non_form_errors }}
        {% endif %}

        <div class="flex -mx-4 module{% if cl.has_filters %} filtered{% endif %}" id="changelist">
            <div class="changelist-form-container flex-grow min-w-0 px-4" x-data="{ filterOpen: false }">
                {% block date_hierarchy %}
                    {% if cl.date_hierarchy %}
                        {% date_hierarchy cl %}
                    {% endif %}
                {% endblock %}

                {% if cl.model_admin.list_before_template %}
                    {% include cl.model_admin.list_before_template %}
                {% endif %}

                <form id="changelist-form" method="post"{% if cl.formset and cl.formset.is_multipart %} enctype="multipart/form-data"{% endif %} novalidate>
                    {% csrf_token %}

                    {% if cl.formset %}
                        <div>{{ cl.formset.management_form }}</div>
                    {% endif %}

                    {% block result_list %}
                        {% if actions_on_top %}
                            {% if cl.search_fields or action_form or cl.has_filters %}
                                <div class="bg-gray-50 flex flex-col gap-3 mb-4 p-3 rounded-md lg:flex-row dark:bg-gray-800">
                                    {% block search %}
                                        {% search_form cl %}
                                    {% endblock %}

                                    {% if action_form %}
                                        {% admin_actions %}
                                    {% endif %}

                                    {% block filters %}
                                        {% if cl.has_filters %}
                                            <a class="{% if cl.has_active_filters %}bg-primary-600 border-primary-600 text-white{% else %}bg-white dark:bg-gray-900 dark:border-gray-700{% endif %} border cursor-pointer flex font-medium group items-center px-3 py-2 rounded-md shadow-sm text-sm lg:ml-auto md:mt-0" x-on:click="filterOpen = true" x-on:keydown.escape.window="filterOpen = false">
                                                {% trans "Filters" %}

                                                <span class="material-symbols-outlined md-18 ml-auto -mr-1 pl-4 {% if cl.has_active_filters %}text-white{% else %}text-gray-400 group-hover:text-gray-500 dark:group-hover:text-gray-400 dark:text-gray-500{% endif %}">filter_list</span>
                                            </a>
                                        {% endif %}
                                    {% endblock %}
                                </div>
                            {% endif %}
                        {% endif %}

                        {% unfold_result_list cl %}

                        {% block pagination %}
                            {% pagination cl %}
                        {% endblock %}
                    {% endblock %}
                </form>

                {% if cl.model_admin.list_after_template %}
                    {% include cl.model_admin.list_after_template %}
                {% endif %}

                {% if cl.has_filters %}
                    {% include "unfold/change_list_filter.html" %}
                {% endif %}
            </div>
        </div>
    </div>
{% endblock %}
